<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Bootstrap Template</title>
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" type="text/css" href="../bootstrap3/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="../bootstrap3/font-awesome-4.7.0/css/font-awesome.css"/>
<style type="text/css">
#s2{
font-size: 30px;
color: red;
}
</style>
</head>
<body>
  <div>div1</div>
  <div class="well">div2</div>
  <h3>可以做按钮的标签有哪些</h3>
  <a class="btn btn-default">按钮1</a>
  <input class="btn btn-default" type="button" value="按钮2">
  <input class="btn btn-default" type="submit" value="按钮3">
  <button class="btn btn-default">按钮三</button>
  <h3>按钮的样式有哪些</h3>
  <a  class="btn btn-default">按钮1</a>
  <a class="btn btn-primary">按钮2</a>
  <a class="btn btn-success">按钮3</a>
  <a class="btn btn-info">按钮4</a>
  <a class="btn btn-warning">按钮5</a>
  <a class="btn btn-danger">按钮6</a>
  <a class="btn btn-link">按钮7</a>
   <h3>按钮的尺寸有哪些</h3>
  <a class="btn btn-primary btn-lg">大按钮</a>
  <a class="btn btn-primary">按钮</a>
  <a class="btn btn-primary btn-sm">小按钮</a>
  <a class="btn btn-primary btn-xs">超小按钮</a>
  <h3>字体图标</h3>
  <span class="glyphicon glyphicon-heart"> 小心心</span>
  <span id="s2" class="fa fa-address-book"> 通讯录</span>
</body>
<script type="text/javascript" src="../bootstrap3/jquery.min.js"></script>
<script type="text/javascript" src="../bootstrap3/js/bootstrap.js"></script>
<script type="text/javascript" src="../bootstrap3/js/holder.js"></script>
<script type="text/javascript" src="../bootstrap3/js/html5shiv.min.js"></script>
<script type="text/javascript" src="../bootstrap3/js/css3-mediaqueries.js"></script>
<script type="text/javascript" src="../bootstrap3/js/respond.min.js"></script>
</html>